import { createUseStyles } from "react-jss";

type StyleProps = { fontSize: number };

export default createUseStyles({
  item: {
    display: "flex",
    boxSizing: "border-box",
    alignItems: "center",
    lineHeight: "18px",
    padding: "0",
    position: "relative",
    fontSize: (props: StyleProps) => props.fontSize,
  },
  input: {
    display: "flex",
    alignItems: "center",
    padding: "6px 0",
    wordBreak: "break-word",
    flexWrap: "wrap",
    "&>span": {
      lineHeight: "24px",
    },
  },
  inputNoLabel: {
    // width: "100%",
  },
  flexStart: {
    justifyContent: "flex-start",
  },
  flexEnd: {
    justifyContent: "flex-start",
  },
  spaceBetween: {
    justifyContent: "space-between",
  },
  suffix: {
    color: "#666",
    lineHeight: "24px",
    margin: "0 11px",
  },
  slack: {
    marginBottom: "12px",
  },
  lastItem: {
    borderBottom: "none",
    marginBottom: "0px",
  },
  labelTips: {
    marginLeft: "5px",
    color: "#999999",
  },
  overlay: {
    padding: "8px 10px",
  },
});
